<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="com.company.ems.model.Employee" %>
<%@ page import="com.company.ems.model.User" %>
<%@ page import="com.company.ems.mapper.UserMapper" %>
<%@ page import="com.company.ems.util.MyBatisUtil" %>
<%@ page import="org.apache.ibatis.session.SqlSession" %>
<%@ page import="java.text.SimpleDateFormat" %>
<%
    User loginUser = (User) session.getAttribute("loginUser");
    if (loginUser == null) {
        response.sendRedirect(request.getContextPath() + "/login.jsp");
        return;
    }
    Employee employee = (Employee) request.getAttribute("employee");
    if (employee == null) {
        request.setAttribute("errorMsg", "员工不存在");
        response.sendRedirect(request.getContextPath() + "/EmployeeServlet?action=list");
        return;
    }

    // 查询创建人姓名
    String createdByName = "未知";
    try (SqlSession sqlSession = MyBatisUtil.getSqlSession()) {
        UserMapper userMapper = sqlSession.getMapper(UserMapper.class);
        User creator = userMapper.selectById(employee.getCreatedBy());
        if (creator != null) {
            createdByName = creator.getUsername();
        }
    } catch (Exception e) {
        e.printStackTrace();
    }

    SimpleDateFormat dateFormat = new SimpleDateFormat("yyyy-MM-dd");
    SimpleDateFormat datetimeFormat = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
%>
<html>
<head>
    <title>查看员工 - 员工信息管理系统</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/style.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css">
    <style>
        /* 详情页专属样式 */
        .detail-container {
            max-width: 900px;
            margin: 30px auto;
            padding: 0 20px;
        }

        .detail-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 24px;
        }

        .detail-card {
            background-color: #fff;
            border-radius: var(--radius);
            box-shadow: var(--shadow);
            padding: 30px;
        }

        .detail-avatar {
            width: 120px;
            height: 120px;
            border-radius: 50%;
            background: linear-gradient(135deg, var(--primary), var(--primary-light));
            margin: 0 auto 24px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            font-size: 48px;
        }

        .detail-name {
            text-align: center;
            font-size: 24px;
            font-weight: 600;
            color: var(--gray-900);
            margin-bottom: 8px;
        }

        .detail-position {
            text-align: center;
            color: var(--gray-700);
            margin-bottom: 30px;
        }

        .detail-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 24px;
            margin-bottom: 30px;
        }

        .detail-item {
            display: flex;
            flex-direction: column;
        }

        .detail-label {
            font-size: 14px;
            color: var(--gray-700);
            margin-bottom: 4px;
            font-weight: 500;
        }

        .detail-value {
            font-size: 16px;
            color: var(--gray-900);
        }

        .detail-divider {
            height: 1px;
            background-color: var(--gray-200);
            margin: 24px 0;
        }

        .detail-meta {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            gap: 16px;
            color: var(--gray-700);
            font-size: 14px;
        }
    </style>
</head>
<body>
<!-- 顶部导航 -->
<nav class="top-nav">
    <div class="nav-brand">
        <i class="fa fa-dashboard"></i>
        <span>员工信息管理系统</span>
    </div>
    <div class="nav-user">
        <span>欢迎您，<%= loginUser.getUsername() %>！</span>
        <a href="${pageContext.request.contextPath}/LogoutServlet" class="logout-btn">
            <i class="fa fa-sign-out"></i> 退出登录
        </a>
    </div>
</nav>

<!-- 主体内容 -->
<div class="detail-container">
    <div class="detail-header">
        <h1 class="page-title">
            <i class="fa fa-user"></i> 员工详情
        </h1>
        <div>
            <a href="${pageContext.request.contextPath}/EmployeeServlet?action=edit&id=<%= employee.getId() %>" class="btn btn-primary">
                <i class="fa fa-pencil"></i> 编辑
            </a>
            <a href="${pageContext.request.contextPath}/EmployeeServlet?action=list" class="btn btn-outline">
                <i class="fa fa-arrow-left"></i> 返回列表
            </a>
        </div>
    </div>

    <div class="detail-card">
        <!-- 员工头像与基本信息 -->
        <div class="detail-avatar">
            <i class="fa fa-user"></i>
        </div>
        <h2 class="detail-name"><%= employee.getName() %></h2>
        <div class="detail-position">
            <%= employee.getDepartment() %> · <%= employee.getPosition() %>
        </div>

        <!-- 详细信息网格 -->
        <div class="detail-grid">
            <div class="detail-item">
                <div class="detail-label">员工ID</div>
                <div class="detail-value"><%= employee.getId() %></div>
            </div>
            <div class="detail-item">
                <div class="detail-label">薪资水平</div>
                <div class="detail-value">¥<%= String.format("%.2f", employee.getSalary()) %> / 月</div>
            </div>
            <div class="detail-item">
                <div class="detail-label">电子邮箱</div>
                <div class="detail-value"><%= employee.getEmail() != null ? employee.getEmail() : "未填写" %></div>
            </div>
            <div class="detail-item">
                <div class="detail-label">联系电话</div>
                <div class="detail-value"><%= employee.getPhone() != null ? employee.getPhone() : "未填写" %></div>
            </div>
            <div class="detail-item">
                <div class="detail-label">入职日期</div>
                <div class="detail-value"><%= dateFormat.format(employee.getHireDate()) %></div>
            </div>
            <div class="detail-item">
                <div class="detail-label">创建人</div>
                <div class="detail-value"><%= createdByName %></div>
            </div>
        </div>

        <div class="detail-divider"></div>

        <!-- 元数据信息 -->
        <div class="detail-meta">
            <div>
                <i class="fa fa-calendar-plus-o"></i> 创建时间：<%= datetimeFormat.format(employee.getCreatedAt()) %>
            </div>
            <div>
                <i class="fa fa-calendar-check-o"></i> 最后更新：<%= datetimeFormat.format(employee.getUpdatedAt()) %>
            </div>
        </div>
    </div>
</div>

<!-- 页脚 -->
<footer class="app-footer">
    <p>© 2025 员工信息管理系统 | 技术栈：Servlet + JSP + MyBatis</p>
</footer>
</body>
</html>